<template>
  <a-upload
      name="file"
      :multiple="true"
      action="/point/upload"
      :headers="headers"
      @change="handleChange"
  >
    <a-button> <a-icon type="upload" /> Click to Upload </a-button>
    <AResult v-if="subTitle" title="导入结果（导入完成后，请刷新页面）" :sub-title="subTitle" />
    <a-row>
      <h4 style="margin-bottom: 16px">
        文件格式:
      </h4>
      <div>
        <a-tag color="pink">
          id
        </a-tag>
        <a-tag color="red">
          x
        </a-tag>
        <a-tag color="orange">
          y
        </a-tag>
        <a-tag color="green">
          green
        </a-tag>
        <a-tag color="cyan">
          cyan
        </a-tag>
        <a-tag color="blue">
          blue
        </a-tag>
        <a-tag color="purple">
          purple
        </a-tag>
      </div>
    </a-row>
    <a-row style="color: #1a5cd7;">
<pre>
id,x,y,,,,
0,-46089,662,,,,
1,-41111,2054,,,,
</pre>
    </a-row>
  </a-upload>
</template>
<script>
export default {
  name:"Upload",
  data() {
    return {
      subTitle: '',
      headers: {
        authorization: 'authorization-text',
      },
    };
  },
  methods: {
    handleChange(info) {
      if (info.file.status !== 'uploading') {
        console.log(info.file, info.fileList);
        if(info.file.response.success){
          this.subTitle = info.file.response.message||'上传成功'
          this.$message.success(info.file.response.message||'上传成功')
        }else{
          this.$message.warning(info.file.response.message||'上传失败')
        }
      }
      if (info.file.status === 'done') {
        this.$message.success(`${info.file.name} file uploaded successfully`);
      } else if (info.file.status === 'error') {
        this.$message.error(`${info.file.name} file upload failed.`);
      }
    },
  },
};
</script>